import React, { useContext, useEffect, useState } from "react"
import { AppContext } from ".."
import { Tooltip } from "antd"

interface PermissionProps {
    code: string
    disabled?: boolean
    NoPermission?: React.ReactNode
    children?: React.ReactNode
}
const Permission = ({ code, disabled, children }: PermissionProps) => {
    const { permission } = useContext(AppContext)
    const [hasPermission, setHasPermission] = useState(false);
    // const []
    useEffect(() => {
        if (permission && permission[code]) {
            setHasPermission(true);
        } else {
            setHasPermission(false);
        }

    }, [permission]);
    if (hasPermission) {
        return children
    }
    return disabled ? <Tooltip title='无权限'>
        {/* @ts-ignore */}
        {React.createElement(children.type, { ...children.props, disabled: true })}
    </Tooltip> : null
}
export default Permission